<div v-cloak id="app" class="main-content">
    <div class="form-body">
        <one-form :config="config" v-model="fdata" ref="ruleForm">
            <div slot="menuLeft">
                <el-button class="button-item" :loading="btnLoading" type="primary" @click="store('ruleForm')" size="small">
                    保存
                </el-button>
                <el-button size="small" @click="backpage()">返回</el-button>
            </div>
            
        </one-form>
    </div>
</div>
{include file="common@components/one-form"}
{include file="common@components/one-upload"}
<script>
    const _formData = {:json_encode((array)$formData, 1)} ;
    const app = new Vue({
        el: "#app",
        data() {
            return {
                uploading:false,
                loading:false,
                btnLoading:false,
                config: {
                    formdesc: [
                        {
                            label: "等级名称 :",
                            prop: "level_name",
                            type: "input",
                            rules:[{ required: true, message: "等级名称"}],
                            bind: {
                                "placeholder": "等级名称",
                            },
                        },
                        {
                            label: "所需成长值 :",
                            prop: "growth",
                            type: "input",
                            rules:[{ pattern: /^\d+$/, message: "所需成长值为数字"}],
                            bind: {
                                "placeholder": "所需成长值",
                            },
                        },
                        {
                            label: "赠送积分 :",
                            prop: "send_point",
                            type: "input",
                            rules:[{pattern: /^\d+$/, message: "赠送积分为数字"}],
                            bind: {
                                "placeholder": "赠送积分",
                            },
                        },
                        {
                            label: "赠送余额 :",
                            prop: "send_balance",
                            type: "input",
                            rules:[{pattern: /^\d+(\.+\d{0,2})?$/, message: "赠送余额为数字"}],
                            bind: {
                                "placeholder": "赠送余额",
                            },
                        },
                        {
                            label: "备注 :",
                            prop: "remark",
                            type: "textarea",
                            bind: {
                                "placeholder": "备注",
                            },
                        },
                       
                    ],
                    labelWidth:"200px",
                    rowSize: 1, //一行可以展示几列表单，默认为3列
                },
                fdata:{
                    id: 0,
                    title: "",
                    img: "",
                },
            }
        }, 
        created() {
        },
        mounted(){
            if (Object.keys(_formData).length > 0) {
                this.fdata = _formData;
            }
        },
        methods: {
            //表单验证
            getFormPromise(form) {
                return new Promise(resolve => {
                    form.validate(res => {
                        resolve(res);
                    })
                })
            },
            store(formName) {
                let _this = this;
                // 获取到组件中的form
                const configForm = this.$refs.ruleForm.$refs.ruleForm;
                // 使用Promise.all去校验结果,可加入多个表单
                Promise.all([configForm].map(this.getFormPromise)).then(res => {
                    const validateResult = res.every(item => !!item);
                    if (validateResult) {
                        _this.loading = true;
                        request({
                            params: {
                                s: "member/level/edit"
                            },
                            method: "post",
                            data: _this.fdata
                        }).then(e => {
                            _this.loading = false;
                            if (e.data.code == 0) {
                                _this.backpage()
                            } else {
                                _this.$message.error(e.data.msg);
                            }
                        })

                    } else {
                        console.log("表单未校验通过");
                    }
                })
                
            },
            backpage(){
                navigateTo({
                    s: "member/level/index",
                })
            },
            //图片上传完成
            uploadSuccess(file,prop){
                file=file.response.data.data.file
                this.fdata[prop] = file
            },
        },

    });
</script>